<div ng-init="init();" class="kmi-layout-content B0236-content">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left" ng-click="back();">
            <i class="material-icons">&#xE408;</i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="brand-title">
            <div class="custom" ng-if="companyName">
                <div class="title" ng-bind="companyName"></div>
                <img src="" alt="" class="brand">
                <div class="gap"></div>
            </div>
            <div class="digiwin">
                <img src="image/smes_v340/logo_ch.png" alt="">
                <img src="image/smes_v340/logo_en.png" alt="">
            </div>
        </div>
        <div class="header-title" ng-bind="'B0236.title' | translate"></div>
        <div class="header-logo"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page" ng-show="mode == 'query' || mode == 'list' || mode == 'preview'">
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'B0236.os_no' | translate"></label>
                <input ng-model="os_no"></input>
                <div class="tip search" ng-click="loadOutSource();"><img src="image/icons/search.png"></img> </div>

                <label class="label" ng-bind="'B0236.outcompany_no' | translate"></label>
                <input ng-model="outcompany_no" style="flex:1;text-align: left;"></input>
                <div class="tip search" ng-click="loadOutCompanyNo();"><img src="image/icons/search.png"></img> </div>

                <label class="label" ng-bind="'B0236.op_no' | translate"></label>
                <input ng-model="op_no" style="flex:1;text-align: left;"></input>
                <div class="tip search" ng-click="loadOpNo();"><img src="image/icons/search.png"></img> </div>

                <div class="kmi-button kmi-button-confrim btn-confirm" ng-click="search()" style="width:100px;margin-left: 16px;">
                    <label ng-bind="'B0236.search' | translate"></label>
                    <div class="kmi-can-click"></div>
                </div>
            </div>

            <div class="kmi-text-fields">
                <label class="label" ng-bind="'B0236.outsource_state' | translate"></label>
                <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="state=0" style="width:150px;">
                    <img ng-show="state!=0" src="image/icons/check0.png"></img>
                    <img ng-show="state==0" src="image/icons/check1.png"></img>
                    {{'B0236.state.column01' | translate}}
                </button>
                <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="state=1" style="width:150px;">
                    <img ng-show="state!=1" src="image/icons/check0.png"></img>
                    <img ng-show="state==1" src="image/icons/check1.png"></img>
                    {{'B0236.state.column02' | translate}}
                </button>
                <!--20220704 modify by wangzy for M#0114824: [��ד���I]����Π�B�顸���ֻ�؛���]�еط����aӡ�����-->
                <!--��Ӳ��ֻػ�ѡ��-->
                <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="state=3" style="width:150px;">
                    <img ng-show="state!=3" src="image/icons/check0.png"></img>
                    <img ng-show="state==3" src="image/icons/check1.png"></img>
                    {{'B0236.state.column04' | translate}}
                </button>
                <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="state=2" style="width:150px;">
                    <img ng-show="state!=2" src="image/icons/check0.png"></img>
                    <img ng-show="state==2" src="image/icons/check1.png"></img>
                    {{'B0236.state.column03' | translate}}
                </button>
            </div>
            <div class="kmi-list column-selector" column-selector-id="itemList">
                <div class="kmi-list__header">
                    <!-- 20230313 modify by Alan for M#129881: -->
                    <div class="kmi-list__column width-fixed require">
                        <button class="mdl-button mdl-js-button mdl-button--icon" ng-click="selectAll();">
                            <img ng-src="{{isSelectAll?'image/icons/check1.png':'image/icons/check0.png'}}"></img>
                        </button>
                    </div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column01' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column02' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column03' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column04' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column05' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column06' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column07' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column08' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0236.list.column09' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in itemList track by $index">
                        <div class="kmi-list__column">
                            <button class="mdl-button mdl-js-button mdl-button--icon" ng-click="itemClick($index,item);">
                                <img ng-hide="item.isSelect" src="image/icons/check0.png"></img>
                                <img ng-show="item.isSelect" src="image/icons/check1.png"></img>
                            </button>
                        </div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="('B0236.state_'+item.outsourcer_state) | translate"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.os_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.outsourcer_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.outsourcer_name"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.op_no"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.op_name"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.create_date"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.close_date"></div>
                        <div class="kmi-list__column column-border" style="flex:1; display: flex;">
                            <label class="label" ng-bind="item.printcount" style="padding-top: 2px;"></label>
                            <i class="material-icons" style="padding-left: 5px; cursor: pointer; z-index: 1;" ng-click="printInfoDialog(item);">&#xE88F;</i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="kmi-layout-page" ng-show="mode == 'print'" style="padding: 0;">
            <iframe id="kmi-pdf-panel" name="kmi-pdf-panel"></iframe>
        </div>
        <div class="kmi-layout-footer" ng-show="mode == 'list' || mode == 'query'">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1"
                    ng-click="search();">
                <img src="image/icons/search2.png"></img> 
            </button>
        </div>
        <div class="kmi-layout-footer" ng-show="mode == 'preview'">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1"
                    ng-click="preview();">
                    <img src="image/icons/print.png"></img>
            </button>
        </div>
        <div class="kmi-layout-footer" ng-show="mode == 'print'">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1 sub"
                    ng-click="print();">
                <img src="image/icons/print.png"></img>
            </button>
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1 sub"
                    ng-click="download();">
                <img src="image/icons/download.png"></img>
            </button>
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1"
                    ng-click="cancel();">
                <img src="image/icons/close.png"></img>
            </button>
        </div>
    </div>
</div>
